<template>
  <view>
    <view class="statistics">
      <!-- <view class="report-title">
        <text class="days">{{sum_1}}</text>
        <text class="unit">天</text>
      </view>
      <view class="sub-title">
        <text>本月签到</text>
      </view>
      <view class="report">
        <view class="column green">
          <text class="column-title">正常签到</text>
          <text class="number">{{sum_1}}</text>
        </view>
        <view class="column orange">
          <text class="column-title">迟到签到</text>
          <text class="number">{{sum_2}}</text>
        </view>
        <view class="column red">
          <text class="column-title">缺勤签到</text>
          <text class="number">{{sum_3}}</text>
        </view>
      </view> -->
    </view>
    <view class="calendar-container">
      <uni-calendar :showMonth=false :insert="true" :lunar="false" :selected="list" @monthSwitch="changeMonth"
                    @confirm="changeMonth" @change="changeDate"></uni-calendar>
    </view>
    <view>
      <uni-list>
        <uni-list-item title="考勤班次:08:30-18:30"/>
        <uni-list-item title="上班:" :rightText="check_in"/>
        <uni-list-item title="下班:" :rightText="check_out"/>
      </uni-list>
    </view>
    <view>
      <uni-file-picker v-model="filesList" limit="9" title="上传资料" :source-type="['album']" @select="uploadImages"
                       @delete="deleteImage"></uni-file-picker>
    </view>
  </view>
</template>

<script>
import Calendar from '../../components/uni-calendar/util';
import uniCalendar from '@/components/uni-calendar/uni-calendar.vue';

export default {
  components: {
    uniCalendar
  },
  data() {
    return {
      list: [],
      sum_1: 0,
      sum_2: 0,
      sum_3: 0,
      check_in: '08:00',
      check_out: '17:30',
      filesList: [],
      date: new Calendar().getDate(new Date()).fullDate
    }
  },
  onShow: function () {
    let that = this
    let date = new Date()
    let year = date.getFullYear()
    let month = date.getMonth() + 1
    that.searchCheckin(that, year, month)
    that.searchDailyCheckin()
  },

  methods: {
    searchCheckin: function (ref, year, month) {
      let that = ref
      that.sum_1 = 0
      that.sum_2 = 0
      that.sum_3 = 0
      that.list.length = 0
      that.ajax(that.url.searchMonthCheckin, "POST", {
        year: year,
        month: month
      }, function (resp) {
        for (let one of resp.data.list) {
          if (one.status === "异常") {
            that.list.push({
              date: one.date,
              color: "red",
              data: {
                custom: '自定义信息',
                name: '自定义消息头',
                aaa: 'aaa',
                bbb: 'bbb'
              }
            })
          }
        }
        that.sum_1 = resp.data.sum_1
        that.sum_2 = resp.data.sum_2
        that.sum_3 = resp.data.sum_3
      })
    },
    changeMonth: function (e) {
      let that = this
      let year = e.year
      let month = e.month
      that.searchCheckin(that, year, month)
    },
    uploadImages: function (e) {
      let base = this.url.base
      let vm = this;
      for (let path of e.tempFilePaths) {
        uni.uploadFile({
          url: this.url.uploadImg, //仅为示例，非真实的接口地址
          filePath: path,
          name: 'img',
          formData: {
            'date': this.date
          },
          "header": {
            token: uni.getStorageSync("token")
          },
          success: (resp) => {
            let respData = JSON.parse(resp.data);
            vm.filesList.push({
              url: base + respData.path,
              extname: '',
              name: ''
            });
          }
        });
      }
    },
    deleteImage: function (e) {
      console.log("deleteImage e is", e)
      this.ajax(this.url.deleteImage, "PUT", {
        "date": this.date,
        "filePath": e.tempFilePath.replace(this.url.base, "")
      }, function (resp) {
      })
    },
    searchDailyCheckin: function () {
      let base = this.url.base
      let vm = this;
      this.ajax(this.url.searchDailyCheckin, "GET", {
        "date": this.date
      }, function (resp) {
        if (resp.statusCode === 200) {
          vm.filesList = [];
          let result = resp.data
          vm.check_in = result.data.checkIn;
          vm.check_out = result.data.checkOut;
          for (let path of result.data.imagePaths) {
            vm.filesList.push({
              url: base + path,
              extname: '',
              name: ''
            });
          }
        }
      });
    },
    changeDate: function (e) {
      this.date = e.fulldate
      this.searchDailyCheckin()
    }
  }
}
</script>

<style lang="less">
@import url('myCheckin.less');
</style>